<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>举报详情页面</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/layer/3.1.0/mobile/need/layer.css">
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/layer/3.1.0/mobile/layer.js"></script>
</head>
<body>
<?php
require_once './dataHandel.php';
$id = isset($_GET['id']) ? htmlspecialchars($_GET['id'],3) : 1;
$data = _Db::instance()->_doQuery("SELECT id,open_id,pic,FROM_UNIXTIME(create_time)AS create_time,content FROM jd_wx_complain WHERE id='$id' ORDER by create_time DESC  LIMIT 1");
$list = _Db::instance()->_doQuery("SELECT a.id,FROM_UNIXTIME(a.create_time)AS create_time,a.content, a.open_id,u.nickname,u.avatar FROM jd_wx_replies a LEFT JOIN jd_wx_users u ON a.`open_id`=u.open_id WHERE a.wx_complain_id=$id ORDER BY create_time DESC");
?>
<h3 style="text-align: center;color: #545353;margin-top: 30px;">举报详情</h3>
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title">举报描述</h3>
    </div>
    <div class="panel-body">
        <p style="margin-left: 30px"><?php echo $data[0]['content'] ?></p>
    </div>
</div>
<?php
if (strlen($data[0]['pic']) && strpos($data[0]['pic'], ',')) {
    $picArr = explode(',', $data[0]['pic']);
    ?>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">举报图片</h3>
        </div>
        <div class="row">
            <div class="col-xs-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="<?php echo $picArr[0] ?>" alt="举报图片">
                </a>
            </div>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">举报图片</h3>
        </div>
        <div class="row">
            <div class="col-xs-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="<?php echo $picArr[1] ?>" alt="举报图片">
                </a>
            </div>
        </div>
    </div>
<?php } ?>
<?php
if (strlen($data[0]['pic']) && !strpos($data[0]['pic'], ',')) {
    ?>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">举报图片</h3>
        </div>
        <div class="row">
            <div class="col-xs-6 col-md-3">
                <a href="#" class="thumbnail">
                    <img src="<?php echo $data[0]['pic'] ?>" alt="举报图片">
                </a>
            </div>
        </div>
    </div>
<?php } ?>
<?php
foreach ($list as $index => $item) {
    ?>
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">回复时间:<span><?php echo $item['create_time'] ?></span></h3>
        </div>
        <div class="panel-body">
            <img width="50" src="<?php if($item['avatar']==null){echo '/weixin/img/jdlogo.png';}else{ echo $item['avatar'];}; ?>">
            <span>回复内容: <span style="color: #0a0a0a"><?php echo $item['content'] ?></span></span>
            <p style="text-align: right">来自:<span  style="color: #0a0a0a;"><?php if($item['nickname']==null){echo '胶东街道办事处';}else{ echo $item['nickname'];}; ?></span></p>
        </div>
    </div>
<?php } ?>
<form role="form" style="margin-bottom: 100px">
    <div class="form-group">
        <label for="name" style="margin-left: 10px">回复:</label>
        <textarea class="form-control" id="content" name="content" rows="8"
                  placeholder="请输入回复内容"></textarea>
    </div>
    <input type="hidden" name="id" id="id" value="<?php echo $data[0]['id'] ?>">
    <input type="hidden" name="id" id="open_id" value="<?php echo $data[0]['open_id'] ?>">
    <button type="button" class="btn btn-primary btn-lg btn-block btn-hf" id="sub" style="margin-top: 50px;">回复
    </button>
</form>
<script>
    var is_submit = false;  //限制提交频率
    $(document).ready(function () {
        $(document).on('click', '.btn-hf', function () {
            var content = $("#content").val(), open_id = $('#open_id').val(), id = $('#id').val();
            var url = 'http://' + "<?php echo $_SERVER['HTTP_HOST']?>" + '/weixin/dataHandel.php?river_id=4&fun=repliesHandel';
            var dataPost = {content: content, open_id: open_id, wx_complain_id: id};
            if (content.length <= 0) {
                layer.open({
                    content: '请填写回复内容'
                    , skin: 'msg'
                    , time: 2 //2秒后自动关闭
                });
                return false;
            }
            $.ajax({
                url: url,
                dataType: 'json',
                type: 'post',
                data: dataPost,
                cache: false,
                async: true,
                beforeSend: function (XMLHttpRequest) {
                    $('#sub').removeClass('btn-hf');
                },
                complete: function (XMLHttpRequest) {
                    $('#sub').addClass('btn-hf');
                },
                success: function (json) {
                    if (json.status > 0) {
                        var url = 'http://' + "<?php echo $_SERVER['HTTP_HOST']?>" + '/weixin/success.html';
                        window.location.href = url;
                    } else {
                        layer.open({
                            content: json.msg
                            , skin: 'msg'
                            , time: 2 //2秒后自动关闭
                        });
                    }
                },
                error: function () {
                    layer.open({
                        content: '请求失败,请稍后重试....'
                        , skin: 'msg'
                        , time: 2 //2秒后自动关闭
                    });
                }
            });
        });
    });

</script>
</body>
</html>